<template>
    <div class="admin-user-index">
        <div class="user-info" v-if="userinfo">
            <div class="file-head">
                <img :src="userinfo.headImg" alt="">
                <input type="file" accept="image/gif,image/jpeg,image/jpg,image/png,image/svg" @change="fileFn">
            </div>
            <div class="username"><span>{{userinfo.name}}</span>
                <small>男</small>
            </div>
        </div>
        <div class="link-list">
            <router-link to="/editor" class="on" target="_blank"><span>发布文章</span></router-link>
            <router-link to=""><span>我的文章</span></router-link>
            <router-link to=""><span>我的收藏</span></router-link>
            <router-link to=""><span>我的资料</span></router-link>
            <router-link to=""><span>我的消息</span></router-link>
            <router-link to=""><span>私&emsp;&emsp;信</span></router-link>
            <router-link to="/"><span>返回首页</span></router-link>
            <a href="javascript:;" v-if="!userinfo.githubId" @click="bindGitHub"><span>绑定GitHub</span></a>
        </div>
        <div class="message-list">
            <ul>
                <li v-for="v in msg" :key="v._id">
                    <div class="type"><span>消息类型</span>
                        <small>{{v.createAt | relativeTime}}</small>
                    </div>
                    <div v-html="v.content"></div>
                </li>
            </ul>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'Admin',
        data() {
            return {
                msg: []
            }
        },
        computed: {
            userinfo() {
                let u = this.$root.userinfo
                if (!u) {
                    return {}
                }
                return this.$root.userinfo
            }
        },
        created() {
            this.getMsgListFn()
        },
        methods: {
            async getMsgListFn() {
                const {data} = await this.$http.get('/v1/message')
                this.msg = data.list
            },
            async fileFn(e) {
                const file = e.target.files[0]
                if (file) {
                    let form = new FormData()
                    form.append('file', file)
                    let {data} = await this.$http.post('/v1/headUpload', form)
                    this.$set(this.$root.userinfo, 'headImg', data.url + '&' + Date.now())
                }
            },
            async bindGitHub() {
                let client_id = process.env.VUE_APP_CLIENT_ID
                let url = `https://github.com/login/oauth/authorize?client_id=${client_id}&scope=user,public_repo&state=bind`
                window.open(url, 'githubsign', "menubar=0,scrollbars=1, resizable=1,status=0,titlebar=0,toolbar=0,location=0,width=520,height=780")
            }
        }
    }
</script>
